<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE-edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>登录</title>
    <!-- Import style -->
    <link rel="stylesheet" href="./static/element-plus/index.css" />
    <!-- Import Vue 3 -->
    <script src="./static/js/vue.global.js"></script>
    <!-- Import component library -->
    <script src="./static/element-plus/index.full.js"></script>
    <script src="./static/element-plus/theme-chalk/display.css"></script>
</head>

<body>
    <div id="app">
        <el-row>
            <el-col :md="24" :lg="8"></el-col>
            <el-col :md="24" :lg="8">
                <h1>登录</h1>
                <el-form ref="form1" style="max-width: 600px" label-width="auto">
                    <el-form-item label="用户名">
                        <el-input v-model="username" placeholder="username" />
                    </el-form-item>
                    <el-form-item label="密码">
                        <el-input v-model="password" placeholder="password" />
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="loginForm">
                            登录
                        </el-button>
                        <el-button type="primary" @click="resetForm">
                            取消
                        </el-button>
                    </el-form-item>
                    <el-col>
                        <el-col :md="24" :lg="8"></el-col>
        </el-row>
    </div>
    <script>
        var App = {
            data() {
                return {
                    username: "",
                    password: "",
                };
            },
            methods: {
                loginForm() {
                    alert("登录成功！");
                },
                resetForm() {
                    this.username = "";
                    this.password = "";
                }
            }
        };
        Vue.createApp(App).use(ElementPlus).mount("#app");
    </script>
</body>

</html>